// 检查用户是否已登录
function checkLogin() {
    const currentUser = localStorage.getItem('currentUser');
    if (!currentUser) {
        // 未登录，跳转到登录页面
        window.location.href = 'index.html';
        return false;
    }
    return true;
}

// 登出功能
function logout() {
    // 清除本地存储的用户信息
    localStorage.removeItem('currentUser');
    // 跳转到登录页面
    window.location.href = 'index.html';
}

// 如果未登录，直接返回
if (!checkLogin()) {
    // 阻止继续执行
    throw new Error('用户未登录');
}

// API基础URL
const API_BASE_URL = 'http://localhost:3001/api';

// 渲染表格数据
function renderTableData(data) {
    const tableBody = document.getElementById('containerTableBody');
    tableBody.innerHTML = '';

    data.forEach((item, index) => {
        const row = document.createElement('tr');
        row.innerHTML = `
            <td>${item.id}</td>
            <td>${item.terminal_name}</td>
            <td>${item.bill_of_lading}</td>
            <td>${item.container_number}</td>
            <td>${item.container_size_type}</td>
            <td>${item.container_type}</td>
            <td>${item.seal_number}</td>
            <td>${item.gross_weight}</td>
            <td>${item.tare_weight}</td>
            <td>${item.terminal_release}</td>
            <td>${item.current_status}</td>
        `;
        tableBody.appendChild(row);
    });

    // 重新绑定事件监听器
    bindEventListeners();
}

// 从API获取所有集装箱数据
async function fetchContainers() {
    try {
        const response = await fetch(`${API_BASE_URL}/containers`);
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        const containers = await response.json();
        renderTableData(containers);
    } catch (error) {
        console.error('获取集装箱数据失败:', error);
        alert('获取集装箱数据失败，请检查服务器是否运行正常');
    }
}

// 绑定事件监听器
function bindEventListeners() {
    // 表格行点击高亮功能
    document.querySelectorAll('.data-table tbody tr').forEach(row => {
        row.addEventListener('click', function () {
            // 移除其他行的高亮
            document.querySelectorAll('.data-table tbody tr').forEach(r => {
                r.style.backgroundColor = '';
            });
            // 高亮当前行
            this.style.backgroundColor = '#e0f7fa';
        });
    });
}

// 搜索功能
async function filterData() {
    const container = document.getElementById('searchContainer').value.toLowerCase();
    const status = document.getElementById('statusFilter').value;

    try {
        const response = await fetch(`${API_BASE_URL}/containers`);
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        const containers = await response.json();

        const filteredData = containers.filter(item => {
            const containerMatch = item.container_number.toLowerCase().includes(container);
            const statusMatch = status === '' || item.current_status === status;
            return containerMatch && statusMatch;
        });

        renderTableData(filteredData);
    } catch (error) {
        console.error('搜索集装箱数据失败:', error);
        alert('搜索集装箱数据失败，请检查服务器是否运行正常');
    }
}

// 初始化页面
document.addEventListener('DOMContentLoaded', function () {
    // 获取并渲染初始数据
    fetchContainers();

    // 搜索按钮事件
    document.getElementById('searchButton').addEventListener('click', filterData);

    // 回车键搜索功能
    document.getElementById('searchContainer').addEventListener('keypress', function (e) {
        if (e.key === 'Enter') {
            filterData();
        }
    });

    // 状态筛选改变时触发搜索
    document.getElementById('statusFilter').addEventListener('change', filterData);

    // 登出链接事件
    const logoutLink = document.getElementById('logoutLink');
    if (logoutLink) {
        logoutLink.addEventListener('click', function(e) {
            e.preventDefault();
            logout();
        });
    }

    // 导航栏交互
    document.querySelectorAll('.sidebar nav ul li a').forEach(link => {
        link.addEventListener('click', function (e) {
            // 移除所有活动状态
            document.querySelectorAll('.sidebar nav ul li a').forEach(l => {
                l.classList.remove('active');
            });
            // 为当前点击的链接添加活动状态
            this.classList.add('active');

            // 这里可以添加页面切换逻辑
            console.log('导航到:', this.querySelector('.title').textContent);
        });
    });
});